<html>
<head>
</head>
<body style="background: transparent;">
    <script src="scripts/docstrap.lib.js"></script>
    <script src="scripts/lunr.min.js"></script>
    <script src="scripts/fulltext-search.js"></script>

    <script type="text/x-docstrap-searchdb">
    {"drag.js.html":{"id":"drag.js.html","title":"Source: drag.js","body":" WolMap Namespaces DragHandlerwolwol.util Classes wol.LayerManagerwol.Locatorwol.MapViewerwol.Tracer Source: drag.js /** * 图片拖动事件集 * Created by Administrator on 2017/4/6 0006. */ (function(global) { /** * 命名空间 * @namespace DragHandler */ global.DragHandler = global.DragHandler || {}; /** * 开始拖动 * @param evt */ DragHandler.startDrag = function(evt, ele) { var dragEle = $(ele); var container = dragEle.parent(); //当前鼠标位置 var mouseX = evt.clientX || evt.pageX || evt.screenX; var mouseY = evt.clientY || evt.pageY || evt.screenY; //被拖动元素所在容器的左上边距 var conMarginL = parseFloat(container.css('margin-left')); var conMarginT = parseFloat(container.css('margin-top')); //被拖动元素的左上边距 var dragEleMarginL = parseFloat(dragEle.css('margin-left')); var dragEleMarginT = parseFloat(dragEle.css('margin-top')); //鼠标相对图片左上角的位置 var mouseOffsetX = mouseX - conMarginL - dragEleMarginL; var mouseOffsetY = mouseY - conMarginT - dragEleMarginT; dragEle.attr('conMarginL', conMarginL); dragEle.attr('conMarginT', conMarginT); dragEle.attr('mouseOffsetX', mouseOffsetX); dragEle.attr('mouseOffsetY', mouseOffsetY); } /** * 拖动中 * @param evt */ DragHandler.dragging = function(evt, ele, callback) { var dragEle = $(ele); //当前鼠标位置 var mouseX = evt.clientX || evt.pageX || evt.screenX; var mouseY = evt.clientY || evt.pageY || evt.screenY; //被拖动元素所在容器的左上边距、鼠标相对图片左上角的位置 var conMarginL = dragEle.attr('conMarginL'); var conMarginT = dragEle.attr('conMarginT'); var mouseOffsetX = dragEle.attr('mouseOffsetX'); var mouseOffsetY = dragEle.attr('mouseOffsetY'); //图片新的位置 var tarMarginL = mouseX - conMarginL - mouseOffsetX; var tarMarginT = mouseY - conMarginT - mouseOffsetY; dragEle.css('margin-left', tarMarginL); dragEle.css('margin-top', tarMarginT); //执行回调 if(callback instanceof Function) { var params = { dragMarginL: tarMarginL, dragMarginT: tarMarginT }; callback(dragEle, params); } } /** * 拖动结束 * @param evt */ DragHandler.endDrag = function(evt, ele) { } /** * 允许放置，拖动过程中鼠标样式显示为可拖动状态，一般用于被拖动元素的父容器 * @param evt */ DragHandler.allowDrop = function(evt) { evt.preventDefault(); } })(window); × Search results Close "},"wol-util.js.html":{"id":"wol-util.js.html","title":"Source: wol-util.js","body":" WolMap Namespaces DragHandlerwolwol.util Classes wol.LayerManagerwol.Locatorwol.MapViewerwol.Tracer Source: wol-util.js /** * 地图操作工具类 * Created by Aegean on 2017/3/8 0008. */ ;(function(global) { //TODO:ol.source.Vector getExtent()报错，如不能解决则手动计算所有feature的extent //TODO:使用ol.extent.boundingExtent /** * 命名空间 * @namespace wol */ global.wol = global.wol || {}; /** * 命名空间 * @namespace wol.util */ global.wol.util = global.wol.util || {}; /** * 通用样式库 * @property {ol.style.Style} DEFAULT_STYLE - 默认样式 * @property {ol.style.Style} TEXT_STYLE - 文本样式 * @property {ol.style.Style} MASK_BLACK - 黑色遮罩样式 */ wol.util.styles = { DEFAULT_STYLE: new ol.style.Style({ fill: new ol.style.Fill({ color : 'rgba(0, 191, 255, 0.5)' }), image: new ol.style.Circle({ fill: new ol.style.Fill({ color : '#00bfff' }), stroke: new ol.style.Stroke({ color: '#bdecff', width: 2 }), radius: 8 }), stroke: new ol.style.Stroke({ color: '#00bfff', width: 3 }) }), TEXT_STYLE: new ol.style.Style({ text: new ol.style.Text({ text: '', offsetY: 18, font: '14px 微软雅黑', textAlign : 'center', fill: new ol.style.Fill({ color : '#2d2d2d', }) }) }), MASK_BLACK: new ol.style.Style({ fill : new ol.style.Fill({ color : 'rgba(0, 0, 0, 0.5)' }) }) }; /** * 创建矢量图层 * @param {object} option - 配置项 * @param {string|undefined} option.name - 图层名称，默认为 undefined * @param {string} option.label - 图层说明，默认为 '' * @param {ol.style.Style} option.style - 图层样式，默认为 wol.util.styles.DEFAULT_STYLE * @param {Array} option.features - 图层默认要素，默认为 [] * @param {boolean} option.updateWhileAnimating - 动画执行过程是否实时渲染要素，默认为 true * @param {boolean} option.updateWhileInteracting - 交互过程是否实时渲染要素，默认为 false * @param {boolean} option.useSpatialIndex - 是否开启空间索引，默认为 false * @param {number} option.opacity - 图层透明度，默认为 1 * @param {boolean} option.visible - 图层可见性，默认为 true * @param {number|undefined} option.zIndex - 图层序号，默认为 undefined * @param {string|undefined} option.group - 图层所属图层组，默认为 undefined 即不属于任何组 * @return {ol.layer.Vector} - 矢量图层 */ wol.util.createVectorLayer = function(option) { var defaults = { name: undefined, label: '', style: wol.util.styles.DEFAULT_STYLE, features: [], updateWhileAnimating: true, updateWhileInteracting: false, useSpatialIndex: false, opacity: 1, visible: true, zIndex: undefined, group: undefined }; option = wol.util.extend(defaults, option); var layer = new ol.layer.Vector({ source: new ol.source.Vector({ features: option.features, useSpatialIndex: option.useSpatialIndex }), style: option.style, updateWhileAnimating: option.updateWhileAnimating, updateWhileInteracting: option.updateWhileInteracting, opacity: option.opacity, visible: option.visible, zIndex: option.zIndex }); layer.set('name', option.name); layer.set('label', option.label); layer.set('group', option.group); layer.set('type', 'Vector'); return layer; } /** * 创建聚合图层 * @param {object} option - 配置项 * @param {string|undefined} option.name - 图层名称，默认为 undefined * @param {string} option.label - 图层说明，默认为 '' * @param {ol.StyleFunction} option.styleFunction - 图层样式函数, 携带feature和resolution两个参数，此函数应返回一个ol.style.Style对象或其数组，由此为单个要素及聚合要素显示不同的样式 * @param {Array} option.features - 图层默认要素，默认为 [] * @param {boolean} option.updateWhileAnimating - 动画执行过程是否实时渲染要素，默认为 true * @param {boolean} option.updateWhileInteracting - 交互过程是否实时渲染要素，默认为 false * @param {number} option.opacity - 图层透明度，默认为 1 * @param {boolean} option.visible - 图层可见性，默认为 true * @param {number|undefined} option.zIndex - 图层序号，默认为 undefined * @param {string|undefined} option.group - 图层所属图层组，默认为 undefined 即不属于任何组 * @return {ol.layer.Vector} - 矢量聚合图层 */ wol.util.createClusterLayer = function(option) { var styleCache = {}; var defaults = { name: undefined, label: '', styleFunction: function(feature) { var size = feature.get('features').length; var style = styleCache[size]; if (!style) { style = new ol.style.Style({ image: new ol.style.Circle({ radius: 10, stroke: new ol.style.Stroke({ color: '#fff' }), fill: new ol.style.Fill({ color: '#3399CC' }) }), text: new ol.style.Text({ text: size.toString(), fill: new ol.style.Fill({ color: '#fff' }) }) }); styleCache[size] = style; } return style; }, features: [], updateWhileAnimating: true, updateWhileInteracting: false, opacity: 1, visible: true, zIndex: undefined, group: undefined }; option = wol.util.extend(defaults, option); var layer = new ol.layer.Vector({ source: new ol.source.Cluster({ distance: 40, source: new ol.source.Vector({ features: option.features, //useSpatialIndex: option.useSpatialIndex //聚合图层中不能使用空间索引 }) }), style: function(feature, resolution) { return option.styleFunction(feature, resolution); }, updateWhileAnimating: option.updateWhileAnimating, updateWhileInteracting: option.updateWhileInteracting, opacity: option.opacity, visible: option.visible, zIndex: option.zIndex }); layer.set('name', option.name); layer.set('label', option.label); layer.set('group', option.group); layer.set('type', 'Cluster'); return layer; } /** * 创建XYZ图层 * @param {object} option - 配置项 * @param {string} option.name - 图层名称，默认为 undefined * @param {string} option.label - 图层说明，默认为 '' * @param {string} option.url - 切片服务地址 * @param {string|undefined} option.crossOrigin - 请求类型，'anonymous' 或 undefined，默认为 undefined；设置为'anonymous'时请求类型变为跨域请求，但切片服务器必须进行跨域设置 * @param {number|undefined} option.minZoom - 图层的最小缩放等级，默认为 undefined * @param {number|undefined} option.maxZoom - 图层的最大缩放等级，超过该等级不再请求新的瓦片，默认为 undefined * @param {number} option.opacity - 图层透明度，默认为 1 * @param {boolean} option.visible - 图层可见性，默认为 true * @param {number} option.zIndex - 图层序号，默认为 undefined * @param {string|undefined} option.group - 图层所属图层组，默认为 undefined 即不属于任何组 * @return {ol.layer.Tile} - 切片图层 */ wol.util.createXYZLayer = function(option) { var defaults = { name: undefined, label: '', url: '', crossOrigin: undefined, minZoom: undefined, maxZoom: undefined, opacity: 1, visible: true, zIndex: undefined, group: undefined }; option = wol.util.extend(defaults, option); var layer = new ol.layer.Tile({ source : new ol.source.XYZ({ url : option.url, crossOrigin: option.crossOrigin, wrapX: option.wrapX, minZoom: option.minZoom, maxZoom: option.maxZoom }), opacity: option.opacity, visible: option.visible, zIndex: option.zIndex }); layer.set('name', option.name); layer.set('label', option.label); layer.set('group', option.group); layer.set('type', 'XYZ'); return layer; } /** * 创建网络地图图层 * @param {object} option - 配置项 * @param {string} option.name - 图层名称，默认为 undefined * @param {string} option.label - 图层说明，默认为 '' * @param {string} option.url - 网络地图服务地址 * @param {object} option.params - WMS必须参数，其中必须包含 LAYERS * @param {string|undefined} option.serverType - 远程网络地图服务类型，可选值为'carmentaserver', 'geoserver', 'mapserver', 'qgis'，默认为 undefined * @param {number} option.maxZoom - 图层的最大缩放等级 * @param {number} option.opacity - 图层透明度，默认为 1 * @param {boolean} option.visible - 图层可见性，默认为 true * @param {number} option.zIndex - 图层序号，默认为 undefined * @param {string|undefined} option.group - 图层所属图层组，默认为 undefined 即不属于任何组 * @return {ol.layer.Tile} - WMS图层 */ wol.util.createWMSLayer = function(option) { var defaults = { name: undefined, label: '', url: '', params: {}, serverType: undefined, maxZoom: undefined, opacity: 1, visible: true, zIndex: undefined, group: undefined }; option = wol.util.extend(defaults, option); var layer = new ol.layer.Tile({ source: new ol.source.TileWMS({ url: option.url, params: option.params, serverType: option.serverType, wrapX: option.wrapX, maxZoom: option.maxZoom }), opacity: option.opacity, visible: option.visible, zIndex: option.zIndex }); layer.set('name', option.name); layer.set('label', option.label); layer.set('group', option.group); layer.set('type', 'WMS'); return layer; } /** * 创建遮罩图层 * @param {object} option - 配置项 * @param {string} option.name - 图层名称，默认为 undefined * @param {string} option.label - 图层说明，默认为 '' * @param {ol.style.Style} option.style - 图层样式，默认为 wol.util.styles.MASK_BLACK * @param {boolean} option.updateWhileAnimating - 动画执行过程是否实时渲染要素，默认为 true * @param {boolean} option.updateWhileInteracting - 交互过程是否实时渲染要素，默认为 true * @param {number} option.opacity - 图层透明度，默认为 1 * @param {boolean} option.visible - 图层可见性，默认为 false * @param {number} option.zIndex - 图层序号，默认为 1 * @param {string|undefined} option.group - 图层所属图层组，默认为 undefined 即不属于任何组 * @return {ol.layer.Vector} - 矢量图层 */ wol.util.createMaskLayer = function(option) { //遮罩要素 var maskFeature = wol.util.createFeatureFromWKT('POLYGON((8140237.764258131 7592337.145509984,8218509.281222153 313086.06785608083,15889117.94369616 313086.06785608083,15732574.909768116 7514065.628545966,8140237.764258131 7592337.145509984))'); // wol.util.transform(maskFeature, 'EPSG:4326', 'EPSG:3857'); var defaults = { name: undefined, label: '', features: [maskFeature], style: wol.util.styles.MASK_BLACK, updateWhileAnimating: true, updateWhileInteracting: true, opacity: 1, visible: false, zIndex: 1, group: undefined }; option = wol.util.extend(defaults, option); var maskLayer = wol.util.createVectorLayer(option); maskLayer.set('name', option.name); maskLayer.set('label', option.label); maskLayer.set('group', option.group); maskLayer.set('type', 'Mask'); return maskLayer; } /** * 创建热力图层 * @param {object} option - 配置项 * @param {string|undefined} option.name - 图层名称，默认为 undefined * @param {string} option.label - 图层说明，默认为 '' * @param {Array} option.feature - 图层默认要素，默认为 [] * @param {Array} option.gradient - 热力图层的色彩渐层颜色，默认为 ['#0ff', '#00f', '#0f0', '#ff0', '#ff5d3e'] * @param {number} option.blur - 模糊值，默认为 24 * @param {number} option.radius - 非聚合状态下最小半径，默认为 10 * @param {number} option.shadow - 阴影值，默认为 300 * @param {number} option.opacity - 图层透明度，默认为 1 * @param {boolean} option.visible - 图层可见性，默认为 true * @param {number|undefined} option.zIndex - 图层序号，默认为 undefined * @param {string|undefined} option.group - 图层所属图层组，默认为 undefined 即不属于任何组 * @return {ol.layer.Heatmap} - 热力图层 */ wol.util.createHeatMap = function(option) { var defaults = { name: undefined, label: '', feature: [], gradient : ['#0ff', '#00f', '#0f0', '#ff0', '#ff5d3e'], blur : 24, radius : 10, shadow : 300, opacity: 1, visible: true, zIndex: undefined, group: undefined, }; option = wol.util.extend(defaults, option); var layer = new ol.layer.Heatmap({ source: new ol.source.Vector({ features : option.features }), gradient: option.gradient, blur: option.blur, radius: option.radius, shadow: option.shadow, opacity: option.opacity, visible: option.visible, zIndex: option.zIndex }); layer.set('name', option.name); layer.set('label', option.label); layer.set('group', option.group); layer.set('type', 'HeatMap'); return layer; } /** * 从WKT字符串中解析要素 * @param {string} wkt - 要素的wkt描述（关于wkt请参见：{@link http://www.cnblogs.com/tiandi/archive/2012/07/18/2598093.html}） * @return {ol.Feature} - 要素对象 */ wol.util.createFeatureFromWKT = function(wkt) { var format = new ol.format.WKT(); return format.readFeature(wkt); } /** * 导出要素为WKT字符串 * @param {ol.Feature} feature - 要素对象 * @return {string} - 要素的wkt描述 */ wol.util.createWKTFromFeature = function(feature) { var format = new ol.format.WKT(); return format.writeFeature(feature); } /** * 对要素进行坐标转化 * @param {ol.Feature} feature - 待转换要素 * @param {ol.proj.ProjectionLike} from - 转换前投影坐标系 * @param {ol.proj.ProjectionLike} to - 转换后投影坐标系 */ wol.util.transform = function(feature, from, to) { feature.getGeometry().transform(from, to); } /** * 对象扩展（jQuery extend机制） * @param {boolean|object} arg - 可变参数，你可以传入任意个参数将它们合并为一个对象；当不传入任何参数或者只有一个参数且类型不是对象，或者该参数为布尔值时将返回空对象；当参数个数大于等于两个时， * 若第一个参数类型不是布尔值或为 false ，将返回后续参数的浅拷贝合并，否则返回第一个参数后续参数的深拷贝合并 * @return {object} - 扩展后的对象 */ wol.util.extend = (function fn() { var options, name, src, copy, copyIsArray, clone, target = arguments[0] || {}, length = arguments.length, i = 1, deep = false; //是否深度拷贝 if(typeof target === \"boolean\") { deep = target; target = arguments[ i ] || {}; i++; } if(typeof target !== \"object\" &amp;&amp; !wol.util.isFunction(target)) { target = {}; } if(i === length) { target = {}; i--; } for(; i &lt; length; i++) { if((options = arguments[i]) != null) { for(name in options) { src = target[name]; copy = options[name]; // Prevent never-ending loop if(target === copy) { continue; } // Recurse if we're merging plain objects or arrays if(deep &amp;&amp; copy &amp;&amp; (wol.util.isPlainObject(copy) || (copyIsArray = Array.isArray(copy)))) { if(copyIsArray) { copyIsArray = false; clone = src &amp;&amp; Array.isArray(src) ? src : []; }else { clone = src &amp;&amp; wol.util.isPlainObject(src) ? src : {}; } // Never move original objects, clone them target[name] = fn(deep, clone, copy); }else if (copy !== undefined) { target[name] = copy; } } } } // Return the modified object return target; }); wol.util.isFunction = function(obj) { return typeof obj === \"function\" &amp;&amp; typeof obj.nodeType !== \"number\"; }; wol.util.isPlainObject = function(obj) { var proto, Ctor; if(!obj || obj.toString() !== \"[object Object]\") { return false; } proto = Object.getPrototypeOf(obj); if(!proto) { return true; } Ctor = proto.hasOwnProperty(\"constructor\") &amp;&amp; proto.constructor; return typeof Ctor === \"function\" &amp;&amp; Ctor.toString() === \"[object Object]\"; }; /** * 获取颜色表示类型 * @param {string} colorStr - 颜色字符串表示 * @return {string} - RGB/十六进制 */ wol.util.getColorType = function(colorStr) { //颜色正则 var rgbColorReg = /^(rgb[(]|RGB[(]).+([)])$/; var hexColorReg = /^#([0-9a-fA-f]{3}|[0-9a-fA-f]{6})$/; if(rgbColorReg.test(colorStr)) { return 'RGB'; }else if(hexColorReg.test(colorStr)) { return 'HEX'; }else { return 'UNKNOWN'; } } /** * 将rgb颜色值转换为16进制形式 * @param {string} rgbStr - 颜色RGB字符串表示 * @return {string} - 颜色16进制字符串表示 */ wol.util.toHexColor = function(rgbStr) { var colorType = wol.util.getColorType(rgbStr); if(colorType === 'RGB') { var aColor = rgbStr.replace(/(?:\\(|\\)|rgb|RGB)*/g, '').split(','); var hexStr = '#'; for(var i = 0; i&lt;aColor.length; i++) { var hex = Number(aColor[i]).toString(16); if(hex === '0'){ hex += hex; } hexStr += hex; } if(hexStr.length !== 7){ hexStr = '#000000'; } return hexStr; }else if(colorType === 'HEX') { var aNum = rgbStr.replace(/#/, '').split(''); if(aNum.length === 6) { return rgbStr; }else if(aNum.length === 3) { var numHex = '#'; for(var i=0; i&lt;aNum.length; i+=1){ numHex += (aNum[i]+aNum[i]); } return numHex; } }else { return '#000000'; } } /** * 将16进制颜色值转换为rgb形式 * @param {string} hexStr - 颜色16进制字符串表示 * @return {string} - 颜色RGB字符串表示 */ wol.util.toRGBColor = function(hexStr) { var sColor = hexStr.toLowerCase(); var colorType = wol.util.getColorType(sColor); if(sColor &amp;&amp; colorType === 'HEX') { if(sColor.length === 4){ var sColorNew = '#'; for(var i = 1; i &lt; 4; i+=1) { sColorNew += sColor.slice(i,i+1).concat(sColor.slice(i,i+1)); } sColor = sColorNew; } //处理六位的颜色值 var sColorChange = []; for(var i = 1; i &lt; 7; i+=2) { sColorChange.push(parseInt('0x' + sColor.slice(i,i+2))); } return 'RGB(' + sColorChange.join(',') + ')'; }else{ return 'RGB(0, 0, 0)'; } } /** * 获取颜色值数组 * @param {string} color - 颜色字符串表示 * @return {Array} - 颜色RGB数组 */ wol.util.getColorArray = function(color) { var type = wol.util.getColorType(color); if(type === 'HEX') { color = wol.util.toRGBColor(color); }else if(type !== 'RGB') { color = 'RGB(0, 0, 0)'; } var temp = color.replace(/(?:\\(|\\)|rgb|RGB)*/g, '').split(','); for(var i = 0; i &lt; temp.length; i++) { temp[i] = parseInt(temp[i]); } return temp; } /** * 拆分坐标点数组，在两两坐标点之间按均匀步长生成密集的坐标点 * @param {Array&lt;ol.Coordinate&gt;} sourceCoords - 原始坐标点数组 * @param {number} step - 步长（沿线方向） * @return {Array&lt;ol.Coordinate&gt;} */ wol.util.splitCoordinates = function(sourceCoords, step) { var len = sourceCoords.length; if(len &gt;= 2) { var i = 0; var newCoords = [], temp; for(; i &lt; len - 1; i++) { temp = _getInterpolation(sourceCoords[i], sourceCoords[i + 1], step); newCoords = newCoords.concat(temp); } return newCoords; }else { throw new Error('至少包含两个点'); } } /** * 根据两个坐标点获取插值数组 * @private * @param {ol.Coordinate} point1 * @param {ol.Coordinate} point2 * @param {number} step - 步长（沿线方向） * @return {Array&lt;Array&gt;} */ function _getInterpolation(point1, point2, step) { //参数设置 var x1 = point1[0], y1 = point1[1], x2 = point2[0], y2 = point2[1]; var targetArray = [point1]; var tempX, tempY; var dirX = x1 &lt; x2 ? 1 : -1, dirY = y1 &lt; y2 ? 1 : -1; var stepX, stepY; if(y1 === y2) { stepX = dirX * step; tempX = x1 + stepX; tempY = y1; while(dirX &gt; 0 ? tempX &lt; x2 : tempX &gt; x2) { targetArray.push([tempX, tempY]); tempX += stepX; } }else if(x1 === x2) { stepY = dirY * step; tempX = x1; tempY = y1 + stepY; while(dirX &gt; 0 ? tempY &lt; y2 : tempY &gt; y2) { targetArray.push([tempX, tempY]); tempY += stepY; } }else { //斜率 var slope = Math.abs((y2 - y1) / (x2 - x1)); //根据步长计算x和y方向增量 var tmpStepX = step / Math.pow((1 + slope * slope), 0.5); var tmpStepY = tmpStepX * slope; stepX = dirX * tmpStepX; stepY = dirY * tmpStepY; tempX = x1 + stepX; tempY = y1 + stepY; while(dirX &gt; 0 ? tempX &lt; x2 : tempX &gt; x2) { targetArray.push([tempX, tempY]); tempX += stepX; tempY += stepY; } } targetArray.push(point2); return targetArray; } wol.util.createShadowFeature = function(map, lineFeature) { var deltaS = 1; var coords = lineFeature.getGeometry().getCoordinates(); var p1 = coords[0], p2 = coords[1]; var k = (p2[1] - p1[1]) / (p2[0] - p1[0]); var tmpSqr1 = Math.sqrt(Math.pow(k, 2) - 1); var newP1 = [p1[0] + (deltaS * k / tmpSqr1), p1[1] - (deltaS / tmpSqr1)], newP2 = [p2[0] + (deltaS * k / tmpSqr1), p2[1] - (deltaS / tmpSqr1)]; console.info(newP1, newP2); var shadowFea = new ol.Feature({ geometry: new ol.geom.LineString([newP1, newP2]) }); var listenerKey; var shadowStyle = new ol.style.Style({ stroke: new ol.style.Stroke({ color: 'white', width: 5 }) }); function animate(event) { var vectorContext = event.vectorContext; var flashGeom = shadowFea.getGeometry(); vectorContext.setStyle(shadowStyle); vectorContext.drawGeometry(flashGeom); } listenerKey = map.on('postcompose', animate); } })(window); × Search results Close "},"wol-layer-manager.js.html":{"id":"wol-layer-manager.js.html","title":"Source: wol-layer-manager.js","body":" WolMap Namespaces DragHandlerwolwol.util Classes wol.LayerManagerwol.Locatorwol.MapViewerwol.Tracer Source: wol-layer-manager.js /** * 图层管理工具 * Created by Aegean on 2017/3/31 0031. */ ;(function(global) { global.wol = global.wol || {}; //图层管理HTML模板 var templateAll = '&lt;div class=\"layer-manager-container in-map pos-absolute\" draggable=\"true\" ondragstart=\"DragHandler.startDrag(event, this)\"' + 'ondrag=\"DragHandler.dragging(event, this)\" ondragend=\"DragHandler.endDrag(event, this)\"&gt;' + '&lt;h4&gt;图层控制&lt;/h4&gt;' + '&lt;div&gt;' + '&lt;ul id=\"wolLayerTree0\" class=\"ztree\"&gt;&lt;/ul&gt;' + '&lt;/div&gt;' + '&lt;/div&gt;'; var templatePart = '&lt;div class=\"layer-manager-container normal\"&gt;' + '&lt;div&gt;' + '&lt;ul id=\"wolLayerTree0\" class=\"ztree\"&gt;&lt;/ul&gt;' + '&lt;/div&gt;' + '&lt;/div&gt;'; /** * 图层管理对象 * @constructor * @param {wol.MapViewer} mapViewer - wol地图实例 */ wol.LayerManager = function(mapViewer) { var _map = mapViewer.getMap(); var _layers; var _treeNodeData; var defaultOption = {exclude: []}; /** * 初始化图层管理对象 * @param {object|undefined} option - 过滤图层，传入待过滤图层的名称或图层名称数组，可选 * @param {string|Array&lt;string&gt;} option.exclude - 过滤图层，传入待过滤图层的名称或图层名称数组 * @param {string} option.target - 图层树目标容器DOM元素id */ this.init = function(option) { defaultOption = wol.util.extend(defaultOption, option); var treeContainer; if(defaultOption.target === undefined) { treeContainer = $(mapViewer.getMap().getTargetElement()); if(treeContainer.attr('has-tree')) { return; } treeContainer.append(templateAll); }else { treeContainer = $('#' + defaultOption.target); if(treeContainer.attr('has-tree')) { return; } treeContainer.append(templatePart); } treeContainer.attr('has-tree', true); _layers = _map.getLayers().getArray(); var groupData = getGroupData(_layers, defaultOption); _treeNodeData = createTreeNodeData(groupData); initTree(_treeNodeData); //注册更新 mapViewer.register('addLayer', update); mapViewer.register('removeLayer', update); } /** * 获取地图实例 * @return {ol.Map} */ this.getMap = function() { return _map; } /** * 获取图层组 */ this.getLayers = function() { return _layers; } /** * 获取图层树 * @return {Array} */ this.getTreeData = function() { return _treeNodeData; } /** * 初始化树（此处所需HTML结构应内部生成，以体现封装性） * @private * @param treeNodeData - 节点数据 * @param mapViewer - wol地图实例 */ function initTree(treeNodeData) { // 设置选项 var setting = { view : { selectedMulti : false }, edit : { enable : true }, check: { enable: true }, data : { simpleData : {enable: true} }, callback : { beforeEditName : beforeEditName, onClick : onClick, onCheck: onCheck } } /** * 编辑节点 * @param treeId * @param treeNode * @return {boolean} */ function beforeEditName(treeId, treeNode) { var zTree = $.fn.zTree.getZTreeObj('treeDemo'); zTree.selectNode(treeNode); return false; } /** * 节点单击事件 * @param event * @param treeId * @param treeNode */ function onClick(event, treeId, treeNode) { //移除选中样式 var selector = '#' + treeNode.tId + '_a'; $(selector).removeClass('curSelectedNode'); } /** * 节点选中事件 * @param event * @param treeId * @param treeNode */ function onCheck(event, treeId, treeNode) { var layerName = treeNode.layerName; var layer = mapViewer.getLayerByName(layerName); if(treeNode.checked) { //显示图层 layer.setVisible(true); }else { //隐藏图层 layer.setVisible(false); } } //执行初始化 $.fn.zTree.init($('#wolLayerTree0'), setting, treeNodeData); } /** * 更新图层树 * @private */ function update() { var groupData = getGroupData(_layers, defaultOption); _treeNodeData = createTreeNodeData(groupData); initTree(_treeNodeData); } } /** * 获取分组数据 * @private * @param {Array&lt;ol.layer.Base&gt;} layers - 图层数组 * @param {object} option - 参数项 */ function getGroupData(layers, option) { var layer, group, breakFlag; var nodeData = {}, node; var filter = option.exclude; filter = (filter) ? filter : []; filter = (filter instanceof Array) ? filter : [filter]; for(var i = 0; i &lt; layers.length; i++) { layer = layers[i]; for(var j = 0; j &lt; filter.length; j++) { if(layer.get('name') === filter[j]) { breakFlag = true; break; } } if(breakFlag) { breakFlag = false; continue; } group = layer.get('group'); if(nodeData[group] === undefined) { nodeData[group] = []; } node = { name: layer.get('name'), label: layer.get('label'), type: layer.get('type'), zIndex: layer.getZIndex(), checked: layer.getVisible() }; //node.label = (node.label.length &gt; 6) ? node.label.substring(0, 6) : node.label; nodeData[group].push(node); } return nodeData; } /** * 创建节点数据 * @param groupData - 分组数据 */ function createTreeNodeData(groupData) { var treeNodeData = [], treeNode; var tempDatas; for(var key in groupData) { if(key === 'undefined') { tempDatas = groupData[key]; for(var i = 0; i &lt; tempDatas.length; i++) { treeNode = { open: true, checked: tempDatas[i].checked, iconSkin: 'layerIcon', name: tempDatas[i].label, layerName: tempDatas[i].name, type: tempDatas[i].type, zIndex: tempDatas[i].zIndex }; treeNodeData.push(treeNode); } }else { tempDatas = groupData[key]; treeNode = { open: false, nocheck: true, iconSkin: 'layersIcon', name: key, children: [] }; for(var i = 0; i &lt; tempDatas.length; i++) { treeNode.children.push({ open: true, checked: tempDatas[i].checked, iconSkin: 'layerIcon', name: tempDatas[i].label, layerName: tempDatas[i].name, type: tempDatas[i].type, zIndex: tempDatas[i].zIndex }); } treeNodeData.push(treeNode); } } return treeNodeData; } })(window); × Search results Close "},"wol-locator.js.html":{"id":"wol-locator.js.html","title":"Source: wol-locator.js","body":" WolMap Namespaces DragHandlerwolwol.util Classes wol.LayerManagerwol.Locatorwol.MapViewerwol.Tracer Source: wol-locator.js /** * 地图要素定位 * Created by Aegean on 2017/3/8 0008. */ ;(function(global) { global.wol = global.wol || {}; /** * 要素定位器 * @constructor * @requires wol-util.js * @param {wol.MapViewer} mapViewer - wol地图实例 */ wol.Locator = function(mapViewer) { var _mapViewer = mapViewer; var _locateLayer; var _locateStyles = { STATIC: new ol.style.Style({ stroke: new ol.style.Stroke({ color: '#00afcc', width: 2 }), fill: new ol.style.Fill({ color: '#00e3ff' }), image: new ol.style.Circle({ stroke: new ol.style.Stroke({ color: '#8fedce', width: 2 }), fill: new ol.style.Fill({ color: '#00c38a' }), radius: 8 }) }), FLASH: new ol.style.Style({ stroke: new ol.style.Stroke({ color: '#ff93a8', width: 2 }), fill: new ol.style.Fill({ color: '#ff607f' }), image: new ol.style.Circle({ stroke: new ol.style.Stroke({ color: '#ff93a8', width: 2 }), fill: new ol.style.Fill({ color: '#ff607f' }), radius: 8 }) }) }; /** * 初始化地图定位实例 * @private */ function _init() { _locateLayer = wol.util.createVectorLayer({ name: 'locateLayer' + new Date().getTime(), label: '定位图层', style: _locateStyles.STATIC, updateWhileAnimating: true, zIndex: 30 }); mapViewer.addLayer(_locateLayer); } /** * 获取wol地图实例 * @return {wol.MapViewer} */ this.getMapViewer = function() { return _mapViewer; } /** * 获取定位图层 * @return {ol.layer.Base} */ this.getLocateLayer = function() { return _locateLayer; }; /** * 获取定位图层数据源 * @return {ol.source.Source} */ this.getLocateSource = function() { return _locateLayer.getSource(); }; /** * 获取定位层静态样式 * @return {ol.style.Style} */ this.getStaticStyle = function() { return _locateStyles.STATIC; }; /** * 设置定位层静态样式 * @param {ol.style.Style} style */ this.setStaticStyle = function(style) { _locateStyles.STATIC = style; this.getLocateLayer().setStyle(style); }; /** * 获取定位层动画样式 * @return {ol.style.Style} */ this.getFlashStyle = function() { return _locateStyles.FLASH; }; /** * 设置定位层动画样式 * @param {ol.style.Style} style */ this.setFlashStyle = function(style) { _locateStyles.FLASH = style; }; /** * 获取点定位描边颜色值 * @return {string} */ this.getPiStrokeColor = function() { var circle = _locateStyles.FLASH.getImage(); return circle.getStroke().getColor(); }; /** * 获取点定位填充颜色值 * @return {string} */ this.getPiFillColor = function() { var circle = _locateStyles.FLASH.getImage(); return circle.getFill().getColor(); }; /** * 获取点定位半径 * @return {string} */ this.getPiRadius = function() { var circle = _locateStyles.FLASH.getImage(); return circle.getRadius(); }; /** * 获取线定位颜色值 * @return {string} */ this.getLsStrokeColor = function() { var style = _locateStyles.FLASH; return style.getStroke().getColor(); }; /** * 获取面定位描边颜色值 * @return {string} */ this.getPlStrokeColor = function() { var style = _locateStyles.FLASH; return style.getStroke().getColor(); }; /** * 获取面定位填充颜色值 * @return {string} */ this.getPlFillColor = function() { var style = _locateStyles.FLASH; return style.getFill().getColor(); }; //初始化 _init(); }; /** * 定位要素 * @param {ol.Feature} feature - 待定位要素 * @param {object} option - 参数项 * @param {number} option.duration - 动画持续时间，可选参数，默认为0 * @param {number} option.times - 动画循环次数，可选参数，默认为3 * @param {boolean} option.autoView - 执行定位动画的同时是否自适应视图，默认为true */ wol.Locator.prototype.locate = function(feature, option) { //是否正在定位 if(!feature.get('locating')) { feature.set('locating', true); }else { console.warn('The feature is being located.'); return; } //合并配置 option = wol.util.extend(true, { duration: 0, times: 3, autoView: true }, option); this.locateProxy(feature, option.duration, option.times, option.autoView); }; /** * 定位要素的代理方法，根据要素类型执行不同的定位动画：Point、LineString、Polygon * @param {ol.Feature} feature - 待定位要素 * @param {number} duration - 动画持续时间，可选参数，默认为0 * @param {number} times - 动画次数，可选参数，默认为3 * @param {boolean} autoView - 是否移动视图至要素，默认为true */ wol.Locator.prototype.locateProxy = function(feature, duration, times, autoView) { if(autoView) { this.getMapViewer().getView().fit(feature.getGeometry(), { size: mapViewer.getMap().getSize(), padding: [50, 50, 50, 50], duration: 600 }); } var self = this; var ifMaintain = false; var locateFea = feature.clone(); var locateFun = 'locate' + locateFea.getGeometry().getType(); var geomType = locateFea.getGeometry().getType(); if(geomType !== 'Point' &amp;&amp; geomType !== 'LineString' &amp;&amp; geomType !== 'Polygon') { console.error('Unsupported type of feature to locate.'); return; }else if(geomType === 'Point') { ifMaintain = false; //self.getLocateSource().addFeature(locateFea); } if(times === -1) { setInterval(function() { self[locateFun](locateFea, duration); }, duration); self[locateFun](locateFea, duration); }else if(times &gt; 0) { var elapseTimes = 0; var timer = setInterval(function() { elapseTimes++; if(elapseTimes &gt; times - 1) { clearInterval(timer); feature.set('locating', false); if(ifMaintain) { self.getLocateSource().removeFeature(locateFea); } return; } self[locateFun](locateFea, duration); }, duration); self[locateFun](locateFea, duration); }else { setTimeout(function() { feature.set('locating', false); if(ifMaintain) { self.getLocateSource().removeFeature(locateFea); } }, duration); } }; /** * 定位点要素 * @param {ol.Feature} feature - 待定位要素 * @param {number} duration - 动画持续时间，可选参数，默认为0 */ wol.Locator.prototype.locatePoint = function(feature, duration) { var self = this; var map = self.getMapViewer().getMap(); var duration = duration; var start = new Date().getTime(); var listenerKey; function animate(event) { var vectorContext = event.vectorContext; var frameState = event.frameState; var flashGeom = feature.getGeometry(); var elapsed = frameState.time - start; var elapsedRatio = elapsed / duration; var style = self.createPointFlashStyle(elapsedRatio, 5, self.getPiRadius()); vectorContext.setStyle(style); vectorContext.drawGeometry(flashGeom); if(elapsed &gt; duration) { ol.Observable.unByKey(listenerKey); return; } map.render(); } listenerKey = map.on('postcompose', animate); //立即触发动画 map.render(); }; /** * 定位线要素 * @param {ol.Feature} feature - 待定位要素 * @param {number} duration - 动画持续时间，可选参数，默认为0 */ wol.Locator.prototype.locateLineString = function(feature, duration) { var self = this; var map = self.getMapViewer().getMap(); var duration = duration; var start = new Date().getTime(); var listenerKey; function animate(event) { var vectorContext = event.vectorContext; var frameState = event.frameState; var flashGeom = feature.getGeometry(); var elapsed = frameState.time - start; var elapsedRatio = elapsed / duration; var style = self.createLineFlashStyle(elapsedRatio); vectorContext.setStyle(style); vectorContext.drawGeometry(flashGeom); if(elapsed &gt; duration) { ol.Observable.unByKey(listenerKey); map.render(); return; } map.render(); } listenerKey = map.on('postcompose', animate); map.render(); }; /** * 定位面要素 * @param {ol.Feature} feature - 待定位要素 * @param {number} duration - 动画持续时间，可选参数，默认为0 */ wol.Locator.prototype.locatePolygon = function(feature, duration) { var self = this; var map = self.getMapViewer().getMap(); var duration = duration; var start = new Date().getTime(); var listenerKey; function animate(event) { var vectorContext = event.vectorContext; var frameState = event.frameState; var flashGeom = feature.getGeometry(); var elapsed = frameState.time - start; var elapsedRatio = elapsed / duration; var style = self.createAreaFlashStyle(elapsedRatio); vectorContext.setStyle(style); vectorContext.drawGeometry(flashGeom); if(elapsed &gt; duration) { ol.Observable.unByKey(listenerKey); map.render(); return; } map.render(); } listenerKey = map.on('postcompose', animate); map.render(); }; /** * 创建点定位闪动样式 * @param {number} elapsedRatio - 动画已执行时间所占比率 * @param {number} startRadius - 起始圆半径 * @param {number} endRadius - 结束圆半径 * @return {ol.style.Style} - 点定位闪动样式 */ wol.Locator.prototype.createPointFlashStyle = function(elapsedRatio, startRadius, endRadius) { var self = this; var curRadius = ol.easing.easeOut(elapsedRatio) * endRadius + startRadius; var opacity = ol.easing.easeOut(1 - elapsedRatio); var color = wol.util.getColorArray(self.getPiStrokeColor()); var style = new ol.style.Style({ image: new ol.style.Circle({ radius: curRadius, snapToPixel: false, stroke: new ol.style.Stroke({ color: 'rgba(' + color[0] + ', ' + color[1] + ', ' + color[2] + ', ' + opacity + ')', width: 2.2 }), /*fill: new ol.style.Fill({ color: self.getPiFillColor() })*/ }) }); return style; }; /** * 创建线定位闪动样式 * @param {number} elapsedRatio - 动画已执行时间所占比率 * @return {ol.style.Style} - 线定位闪动样式 */ wol.Locator.prototype.createLineFlashStyle = function(elapsedRatio) { var self = this; var opacity = ol.easing.upAndDown(1 - elapsedRatio); var color = wol.util.getColorArray(self.getLsStrokeColor()); var style = new ol.style.Style({ stroke: new ol.style.Stroke({ color: 'rgba(' + color[0] + ', ' + color[1] + ', ' + color[2] + ', ' + opacity + ')', width: 4 }) }); return style; }; /** * 创建面定位闪动样式 * @param {number} elapsedRatio - 动画已执行时间所占比率 * @return {ol.style.Style} - 面定位闪动样式 */ wol.Locator.prototype.createAreaFlashStyle = function(elapsedRatio) { var self = this; var opacity = ol.easing.upAndDown(elapsedRatio); var color1 = wol.util.getColorArray(self.getPlStrokeColor()); var color2 = wol.util.getColorArray(self.getPlFillColor()); var style = new ol.style.Style({ stroke: new ol.style.Stroke({ color: 'rgba(' + color1[0] + ', ' + color1[1] + ', ' + color1[2] + ', ' + opacity + ')', width: 4 }), fill: new ol.style.Fill({ color: 'rgba(' + color2[0] + ', ' + color2[1] + ', ' + color2[2] + ', ' + opacity + ')' }) }); return style; }; })(window); × Search results Close "},"wol-viewer.js.html":{"id":"wol-viewer.js.html","title":"Source: wol-viewer.js","body":" WolMap Namespaces DragHandlerwolwol.util Classes wol.LayerManagerwol.Locatorwol.MapViewerwol.Tracer Source: wol-viewer.js /** * 地图浏览 * Created by Aegean on 2017/3/7 0007. */ ;(function(global) { global.wol = global.wol || {}; /** * wol地图 * @constructor * @requires wol-util.js * @param {string} id - DOM元素id * @param {object} option - 配置项 * @param {string} option.projection - 投影坐标系 * @param {Array} option.center - 视图中心位置，默认为 [13059385.715379057, 4734320.828070238] * @param {Array} option.extent - 视图范围 * @param {Array} option.layers - 图层配置，通过传入一至多个配置项创建图层，每个配置项须包含图层类型(type)，图层名称(name)，地图服务地址(url)等必要参数；图层类型可选值为'Vector'、'Cluster'、'Mask'、'XYZ'、'WMS'， * 图层类型为'XYZ'或'WMS'时需指定地图服务地址；配置项中其他参数设置请参见{@link wol.util.createVectorLayer}、{@link wol.util.createClusterLayer}、{@link wol.util.createMaskLayer}、{@link wol.util.createXYZLayer}、{@link wol.util.createWMSLayer}、 * @param {number|undefined} option.zoom - 当前缩放类型，默认为 undefiend * @param {number|undefined} option.minZoom - 地图最小缩放级别，默认为 undefiend * @param {number|undefined} option.maxZoom - 地图最大缩放级别，默认为 undefiend * @param {object|undefined} option.controls - 地图控件配置 * @param {boolean|undefined} option.controls.zoom - 是否显示地图缩放控件，默认为 true * @param {boolean|undefined} option.controls.scaleLine - 是否显示比例尺控件，默认为 true * @param {boolean|undefined} option.controls.overviewMap - 是否显示鹰眼控件，默认为 false * @param {boolean|undefined} option.controls.fullScreen - 是否显示全屏控件，默认为 false */ wol.MapViewer = function(id, option) { var _map, _curZIndex = 0; //默认配置对象 var defaultOption = { projection: 'EPSG:3857', center: [13059385.715379057, 4734320.828070238], extent: [], layers: [], zoom: undefined, minZoom: undefined, maxZoom: undefined, controls: { zoom: true, scaleLine: true, overviewMap: false, fullScreen: false } }; //合并配置 option = wol.util.extend(true, defaultOption, option); /** * 初始化地图浏览实例 * @private * @param option */ function _init(option) { var view = new ol.View({ center: option.center, projection: option.projection, zoom: option.zoom, minZoom: option.minZoom, maxZoom: option.maxZoom }); _map = new ol.Map({ target: id, logo: false, view: view, controls: [] }); } /** * 回调函数 */ this.callback = {}; /** * 获取地图实例 * @this wol.MapViewer * @return {ol.Map} */ this.getMap = function() { return _map; } /** * 获取图层序号值 * @this wol.MapViewer * @return {number} */ this.getCurZIndex = function() { return _curZIndex; } /** * 设置图层序号值 * @this wol.MapViewer * @param {number} curZIndex */ this.setCurZIndex = function(curZIndex) { _curZIndex = curZIndex; } //初始化 _init(option); this.addLayers(_initLayers(option.layers)); _initControls(_map, option.controls); } /** * 事件注册，目前仅支持'addLayer'和'removeLayer'事件 * @param evtType * @param handler */ wol.MapViewer.prototype.register = function(evtType, handler) { this.callback[evtType] = (this.callback[evtType]) ? this.callback[evtType] : []; this.callback[evtType].push(handler); } /** * 获取视图实例 * @return {ol.View} - 地图对象 */ wol.MapViewer.prototype.getView = function() { return this.getMap().getView(); } /** * 获取图层集合 * @return {ol.Collection} - ol集合对象 */ wol.MapViewer.prototype.getLayers = function() { return this.getMap().getLayers(); } /** * 根据图层名称获取图层 * @param {string} name - 图层名称 * @return {ol.layer.Base} - 图层对象 */ wol.MapViewer.prototype.getLayerByName = function(name) { var layers = this.getMap().getLayers(); var len = layers.getLength(); var layer = null; for(var i = 0; i &lt; len; i++) { if(layers.item(i).get('name') === name) { layer = layers.item(i); break; } } return layer; } /** * 添加图层 * @param {ol.layer.Base} layer - 图层对象 */ wol.MapViewer.prototype.addLayer = function(layer) { var zIndex = layer.getZIndex(); if(!zIndex || zIndex &lt;= 1) { var curZIndex = this.getCurZIndex(); layer.setZIndex(curZIndex); this.setCurZIndex(curZIndex + 1); } this.getMap().addLayer(layer); //执行回调 var callbacks = this.callback['addLayer'] || []; for(var i = 0; i &lt; callbacks.length; i++) { callbacks[i](); } } /** * 添加多个图层 * @param {Array&lt;ol.layer.Base&gt;} layers - 图层对象数组 */ wol.MapViewer.prototype.addLayers = function(layers) { for(var i = 0; i &lt; layers.length; i++) { this.addLayer(layers[i]); } } /** * 删除图层 * @param {ol.layer.Base} layer - 图层对象 */ wol.MapViewer.prototype.removeLayer = function(layer) { this.getMap().removeLayer(layer); //执行回调 var callbacks = this.callback['removeLayer'] || []; for(var i = 0; i &lt; callbacks.length; i++) { callbacks[i](); } } /** * 删除多个图层 * @param {Array&lt;ol.layer.Base&gt;} layers - 图层对象数组 */ wol.MapViewer.prototype.removeLayers = function(layers) { for(var i = 0; i &lt; layers.length; i++) { this.removeLayer(layers[i]); } } /** * 根据图层名称删除图层 * @param {string} name - 图层名称 */ wol.MapViewer.prototype.removeLayerByName = function(name) { this.getMap().removeLayer(this.getLayerByName(name)); } /** * 平移视图中心点至某一坐标点或某一要素 * @param {ol.Coordinate|ol.Feature} target - 目标坐标点或目标要素 * @param {number} duration - 动画持续时间，可选参数，默认为0 */ wol.MapViewer.prototype.panTo = function(target, duration) { var coord; //判断是否是要素 if(target instanceof ol.Feature) { coord = ol.extent.getCenter(target.getGeometry().getExtent()); }else { coord = target; } //是否开启动画 if(duration === undefined || duration === 0) { this.getView().setCenter(coord); }else { this.getView().animate({center: coord}, {duration: duration}); } } /** * 缩放视图至指定范围 * @param {ol.Extent|ol.geom.Geometry} target - 目标视图范围 * @param {number} duration - 动画持续时间，可选参数，默认为0 * @param {number | Array} padding - 目标视图周围间距 */ wol.MapViewer.prototype.extentAt = function(target, duration, padding) { var tarPadding; if(padding instanceof Array &amp;&amp; padding.length === 4) { tarPadding = padding; }else if(!isNaN(padding)) { tarPadding = [padding, padding, padding, padding]; }else { tarPadding = [50, 50, 50, 50]; } this.getView().fit(target, { size: this.getMap().getSize(), padding: tarPadding, duration: duration }); } /** * 初始化图层数组 * @private * @param {Array&lt;option&lt;object&gt;&gt;} options * @return {Array&lt;ol.layer.Base&gt;} */ function _initLayers(options) { var layers = []; for(var i = 0; i &lt; options.length; i++) { if(options[i].type === 'Vector') { layers.push(wol.util.createVectorLayer(options[i])); }else if(options[i].type === 'Cluster') { layers.push(wol.util.createClusterLayer(options[i])); }else if(options[i].type === 'XYZ') { layers.push(wol.util.createXYZLayer(options[i])); }else if(options[i].type === 'WMS') { layers.push(wol.util.createWMSLayer(options[i])); }else if(options[i].type === 'Mask') { layers.push(wol.util.createMaskLayer(options[i])); }else if(options[i].type === 'HeatMap') { layers.push(wol.util.createHeatMap(options[i])); }else { console.warn('Unsupported type of the layer being created.'); } } return layers; } /** * 初始化地图控件 * @private * @param {ol.Map} map * @param {object} option */ function _initControls(map, option) { //创建地图控件：缩放按钮、比例尺、鹰眼、全屏 if(option.zoom) { var zoom = new ol.control.Zoom(); map.addControl(zoom); } if(option.scaleLine) { var scaline = new ol.control.ScaleLine(); map.addControl(scaline); //防堆叠 var scalineEle = document.getElementsByClassName('ol-scale-line'); scalineEle[0].style.left = 11 + 'px'; scalineEle[0].style.bottom = 8 + 'px'; } if(option.overviewMap) { var overview = new ol.control.OverviewMap(); map.addControl(overview); //防堆叠 var scalineEle = document.getElementsByClassName('ol-scale-line'); if(scalineEle.length &gt; 0) { var overviewEle = document.getElementsByClassName('ol-overviewmap'); overviewEle[0].style.bottom = 33 + 'px'; } } if(option.fullScreen) { var fullscreen = new ol.control.FullScreen(); map.addControl(fullscreen); } } })(window); × Search results Close "},"wol-tracer.js.html":{"id":"wol-tracer.js.html","title":"Source: wol-tracer.js","body":" WolMap Namespaces DragHandlerwolwol.util Classes wol.LayerManagerwol.Locatorwol.MapViewerwol.Tracer Source: wol-tracer.js /** * 轨迹播放控件 * Created by Aegean on 2017/3/17 0017. */ ;(function(global) { global.wol = global.wol || {}; //预置速度 var SPEED = { 'slow': 1, 'normal': 5, 'fast': 10 }; //当前脚本路径 var _curJsPath = decodeURI(_currentScriptPath()); var pathArr = _curJsPath.split('/'); pathArr.pop(); var newPath = pathArr.join('/'); var _iconPath = newPath + '/image/drone.gif'; /** * 轨迹对象 * @constructor * @requires wol-util.js * @param {wol.MapViewer} mapViewer - wol地图实例 */ wol.Tracer = function(mapViewer) { var _mapViewer = mapViewer; var _traceLayer, _traceLine, _flashLine, _flashPoint, _flashPOverlay; //默认配置项 var _defaultOption = { source: null, speed: SPEED.normal, afterInitialize: function() {}, afterStart: function() {}, afterComplete: function() {}, icon: _iconPath, //轨迹播放图标 iconClass: '', //图标样式 iconSize: 40, //图标大小 iconOpacity: 1, //图标透明度 ifDynamicTrack: false, ifLocate: false }; //轨迹样式 var _traceStyles = { STATIC_LINE: new ol.style.Style({ stroke: new ol.style.Stroke({ color: '#374f62', width: 2, lineDash: [6, 4] }) }), FLASH_LINE: new ol.style.Style({ stroke: new ol.style.Stroke({ color: '#23e6a1', width: 3 }) }), FLASH_POINT: _getIconStyle({ src: _iconPath, opacity: 0.95 }) }; /** * 动画状态 * @type {object} */ this.status = { initialize: false, start: false, animating: false, complete: false }; /** * 动画计时器 * @type {object|null} */ this.timer = null; /** * 动画参数 * @type {object} */ this.animateParam = {}; /** * 初始化轨迹播放实例 * @param {object} option - 初始化配置项 * @param {ol.Feature} option.src - 轨迹线要素 * @param {string|number} option.speed - 轨迹播放速度，可选值为'slow'、'normal'、'fast'，也可以是大于0的具体数值，默认为 3 * @param {function} option.afterInitialize - 轨迹初始化后的回调函数，默认为空函数 * @param {function} option.afterStart - 轨迹开始播放的回调函数，默认为空函数 * @param {function} option.afterComplete - 轨迹播放完成的回调函数，默认为空函数 * @param {boolean} option.ifDynamicTrack - 轨迹播放过程中是否开启动态追踪，默认为 false * @param {boolean} option.ifLocate - 轨迹初始化完成后是否定位至轨迹点，默认为 false * @param {boolean} option.icon - 轨迹播放图标文件路径，应是相对于该JS文件执行目录（引用该文件的页面所在目录）的路径 * @param {boolean} option.iconClass - 轨迹播放图标CSS样式，默认为‘’ * @param {boolean} option.iconSize - 轨迹播放图标大小，默认为40 * @param {boolean} option.iconOpacity - 轨迹播放图标透明度，默认为1 */ this.init = function(option) { if(this.status.initialize) { console.error('轨迹已初始化'); return; } option = wol.util.extend(_defaultOption, option); _initTraceParams(option, this); _traceLayer = wol.util.createVectorLayer({ name: 'traceLayer' + new Date().getTime(), label: '轨迹图层', style: _traceStyles.STATIC, features: [_traceLine, _flashLine], updateWhileAnimating: true, updateWhileInteracting: true, zIndex: 25 }); mapViewer.addLayer(_traceLayer); mapViewer.getMap().addOverlay(_flashPOverlay); //设置动画状态 this.status.initialize = true; this.animateParam.afterInitialize(); if(option.ifLocate) { this.getMapViewer().panTo(this.animateParam.tempCoord, 400); } } /** * 初始化轨迹参数 * @private * @param option * @param self */ function _initTraceParams(option, self) { var traceLine = option.source; if(traceLine === null || !(traceLine instanceof ol.Feature) || !(traceLine.getGeometry() instanceof ol.geom.LineString)) { console.error('参数错误'); return; } var speed = option.speed; if(speed === 'slow') { speed = SPEED.slow; }else if(speed === 'normal') { speed = SPEED.normal; }else if(speed === 'fast') { speed = SPEED.fast; }else if(isNaN(speed)) { speed = 1; }else { speed = parseFloat(speed); } option.speed = speed; _traceLine = traceLine; var coords = traceLine.getGeometry().getCoordinates(); var newCoords = wol.util.splitCoordinates(coords, option.speed); _flashLine = new ol.Feature(new ol.geom.LineString([coords[0]])); // _flashPoint = new ol.Feature(new ol.geom.Point(coords[0])); _flashPOverlay = new ol.Overlay({ element: _createPointOverlay({ icon: option.icon, clas: option.iconClass, size: option.iconSize, opacity: option.iconOpacity }), position: coords[0], positioning: 'center-center' }); _traceLine.setStyle(_traceStyles.STATIC_LINE); _flashLine.setStyle(_traceStyles.FLASH_LINE); // _flashPoint.setStyle(_traceStyles.FLASH_POINT); self.animateParam.speed = option.speed; self.animateParam.srcCoords = newCoords; self.animateParam.tempCoord = newCoords[0]; self.animateParam.coordLen = newCoords.length; self.animateParam.flashLineGeom = _flashLine.getGeometry(); // self.animateParam.flashPointGeom = _flashPoint.getGeometry(); self.animateParam.flashPointOverlay = _flashPOverlay; self.animateParam.afterInitialize = option.afterInitialize; self.animateParam.afterStart = option.afterStart; self.animateParam.afterComplete = option.afterComplete; self.animateParam.ifDynamicTrack = option.ifDynamicTrack; _initAnimateParams(self); } /** * 获取wol地图实例 * @return {wol.MapViewer} */ this.getMapViewer = function() { return _mapViewer; } /** * 获取轨迹图层 * @return {ol.layer.Base} */ this.getTraceLayer = function() { return _traceLayer; } /** * 获取轨迹图层数据源 * @return {ol.source.Source} */ this.getTraceSource = function() { return _traceLayer.getSource(); } /** * 获取轨迹线要素 * @return {ol.Feature} */ this.getTraceLine = function() { return _traceLine; } /** * 获取动画轨迹线要素 * @return {ol.Feature} */ this.getFlashLine = function() { return _flashLine; } /** * 获取动画轨迹点要素 * @return {ol.Feature} */ this.getFlashPoint = function() { return _flashPoint; } } /** * 初始化动画参数 * @private */ function _initAnimateParams(self) { self.animateParam.flashCoords = [self.animateParam.srcCoords[0]]; self.animateParam.index = 0; } /** * 播放轨迹，你可以在轨迹初始化完成后调用该方法播放轨迹或轨迹暂停播放后调用该方法继续播放 */ wol.Tracer.prototype.play = function() { var self = this, delay = 0; if(!self.status.initialize) { console.error('轨迹已销毁或未初始化'); return; }else if(!self.status.start) { self.status.start = true; self.animateParam.afterStart(); //未开启动态追踪则调整视图 if(!self.animateParam.ifDynamicTrack) { _switchView(self.getMapViewer().getMap(), self.animateParam.tempCoord, self.animateParam.speed); delay = 100; }else { self.getMapViewer().getMap().getView().setZoom(15); } }else if(self.status.animating) { console.info('动画正在播放'); return; }else if(self.status.complete) { console.info('动画已结束'); return; } var ifContain; setTimeout(function() { self.status.animating = true; self.timer = setInterval(function() { if(self.animateParam.index &lt; self.animateParam.coordLen - 1) { self.animateParam.tempCoord = self.animateParam.srcCoords[self.animateParam.index + 1]; self.animateParam.flashCoords.push(self.animateParam.tempCoord); self.animateParam.flashLineGeom.setCoordinates(self.animateParam.flashCoords); // self.animateParam.flashPointGeom.setCoordinates(self.animateParam.tempCoord); self.animateParam.flashPointOverlay.setPosition(self.animateParam.tempCoord); //是否动态追踪 if(self.animateParam.ifDynamicTrack) { self.getMapViewer().panTo(self.animateParam.tempCoord, 0); }else { ifContain = _ifContainFlashPoint(self.getMapViewer().getMap(), self.animateParam.tempCoord); if(!ifContain) { _switchView(self.getMapViewer().getMap(), self.animateParam.tempCoord, self.animateParam.speed); } } self.animateParam.index++; }else { clearInterval(self.timer); self.status.animating = false; self.status.complete = true; self.animateParam.afterComplete(); } }, 5); }, delay); } /** * 暂停轨迹播放 */ wol.Tracer.prototype.pause = function() { var self = this; if(!self.status.animating) { console.error('动画未处于播放状态'); return; }else { clearInterval(self.timer); self.status.animating = false; } } /** * 重置轨迹播放 */ wol.Tracer.prototype.reset = function() { var self = this; if(!self.status.initialize) { console.error('轨迹已销毁或未初始化'); return; } clearInterval(self.timer); self.status.start = false; self.status.animating = false; _initAnimateParams(self); var coord = self.animateParam.srcCoords[0]; self.animateParam.flashLineGeom.setCoordinates(self.animateParam.flashCoords); // self.animateParam.flashPointGeom.setCoordinates(coord); self.animateParam.flashPointOverlay.setPosition(coord); self.animateParam.tempCoord = coord; self.getMapViewer().panTo(coord, 600); } /** * 清除轨迹，清除之后若要执行轨迹播放你将必须重新初始化轨迹 */ wol.Tracer.prototype.clear = function() { var self = this; if(!self.status.initialize) { console.error('轨迹已销毁或未初始化'); return; } clearInterval(self.timer); self.status.initialize = false; self.status.start = false; self.status.animating = false; self.status.complete = false; _initAnimateParams(self); var source = self.getTraceSource(); source.removeFeature(self.getTraceLine()); source.removeFeature(self.getFlashLine()); source.removeFeature(self.getFlashPoint()); } /** * 平移视图中心点 * @param {ol.Coordinate} target - 目标坐标点 * @param {number} duration - 动画持续时间，可选参数，默认为0 */ /*wol.Tracer.prototype.panTo = function(target, duration) { var self = this; var map = self.getMapViewer().getMap(); var view = map.getView(); //是否开启动画 if(duration == undefined || duration == 0) { view.setCenter(target); }else { view.animate({center: target}, {duration: duration}); } }*/ /** * 设置静态轨迹线样式 * @param {ol.style.Style} style - 样式实例 */ wol.Tracer.prototype.setStaticStyle = function(style) { var self = this; self.getTraceLine().setStyle(style); } /** * 设置动态轨迹线样式 * @param {ol.style.Style} style - 样式实例 */ wol.Tracer.prototype.setFlashStyle = function(style) { var self = this; self.getFlashLine().setStyle(style); } /** * 设置轨迹图标 * @param {string} uri - 图标文件地址 wol.Tracer.prototype.setIcon = function(uri) { var iconEle = this.animateParam.flashPointOverlay.getElement(); iconEle.style.backgroundImage = 'url(' + uri + ') !important'; console.info(uri); console.info(iconEle); }*/ /** * 切屏 * @private * @param {ol.Map} map * @param {ol.Coordinate} coords */ function _switchView(map, coord, speed) { var view = map.getView(); var durTime = 50; if(speed) { if(speed &lt;= 5) { durTime = 100; }else if(speed &gt; 5 &amp;&amp; speed &lt;= 9) { durTime = 50; }else { durTime = 0; } } if(speed &amp;&amp; durTime &gt; 0) { view.animate({center: coord}, {duration: durTime}); }else { view.setZoom(15); view.setCenter(coord); } } /** * 轨迹点在地图上是否可见 * @private * @param map * @param coord */ function _ifContainFlashPoint(map, coord) { var view = map.getView(); var viewExtent = view.calculateExtent(map.getSize()); var flag = ol.extent.containsCoordinate(viewExtent, coord); return flag; } /** * 获取当前脚本的 URI * @private * @return {String} */ function _currentScriptPath() { var scripts = document.getElementsByTagName( \"script\" ); var script = scripts[ scripts.length - 1 ]; return script.hasAttribute ? script.src : script.getAttribute( \"src\"); } /** * 获取图标样式 * @private * @param option */ function _getIconStyle(option) { var defaults = { anchor: [0.5, 1], anchorXUnits: 'fraction', anchorYUnits: 'fraction', src: _iconPath, scale: 1, opacity: 1 }; option = wol.util.extend(defaults, option); return new ol.style.Style({ image: new ol.style.Icon(({ anchor: option.anchor, anchorXUnits: option.anchorXUnits, anchorYUnits: option.anchorYUnits, src: option.src, scale: option.scale, opacity: option.opacity })) }); } /** * 创建点悬浮层 * @private */ function _createPointOverlay(option) { var ele = document.createElement('div'); ele.style.width = option.size + 'px'; ele.style.height = option.size + 'px'; ele.className = option.clas; ele.style.background = 'url(' + option.icon + ') no-repeat'; ele.style.backgroundSize = option.size + 'px'; ele.style.opacity = option.opacity; return ele; } })(window); × Search results Close "},"classes.list.html":{"id":"classes.list.html","title":"Classes","body":" WolMap Namespaces DragHandlerwolwol.util Classes wol.LayerManagerwol.Locatorwol.MapViewerwol.Tracer Classes Classes LayerManager Locator MapViewer Tracer Namespaces DragHandler wol util × Search results Close "},"namespaces.list.html":{"id":"namespaces.list.html","title":"Namespaces","body":" WolMap Namespaces DragHandlerwolwol.util Classes wol.LayerManagerwol.Locatorwol.MapViewerwol.Tracer Namespaces Classes LayerManager Locator MapViewer Tracer Namespaces DragHandler wol util × Search results Close "},"index.html":{"id":"index.html","title":"Index","body":" WolMap Namespaces DragHandlerwolwol.util Classes wol.LayerManagerwol.Locatorwol.MapViewerwol.Tracer WolMap 基于OpenLayers 二次封装的js地图模块，提供要素编辑、地图定位、轨迹回放等开箱即用的功能，实现地图应用的快速开发。 License MIT Copyright (c) 2017-present, agsea × Search results Close "},"DragHandler.html":{"id":"DragHandler.html","title":"Namespace: DragHandler","body":" WolMap Namespaces DragHandlerwolwol.util Classes wol.LayerManagerwol.Locatorwol.MapViewerwol.Tracer Namespace: DragHandler DragHandler 命名空间 Source: drag.js, line 7 Methods &lt;static&gt; allowDrop(evt) 允许放置，拖动过程中鼠标样式显示为可拖动状态，一般用于被拖动元素的父容器 Parameters: Name Type Description evt Source: drag.js, line 88 &lt;static&gt; dragging(evt) 拖动中 Parameters: Name Type Description evt Source: drag.js, line 48 &lt;static&gt; endDrag(evt) 拖动结束 Parameters: Name Type Description evt Source: drag.js, line 81 &lt;static&gt; startDrag(evt) 开始拖动 Parameters: Name Type Description evt Source: drag.js, line 17 × Search results Close "},"wol.html":{"id":"wol.html","title":"Namespace: wol","body":" WolMap Namespaces DragHandlerwolwol.util Classes wol.LayerManagerwol.Locatorwol.MapViewerwol.Tracer Namespace: wol wol 命名空间 Source: wol-util.js, line 10 Classes LayerManager Locator MapViewer Tracer Namespaces util × Search results Close "},"wol.LayerManager.html":{"id":"wol.LayerManager.html","title":"Class: LayerManager","body":" WolMap Namespaces DragHandlerwolwol.util Classes wol.LayerManagerwol.Locatorwol.MapViewerwol.Tracer Class: LayerManager wol. LayerManager new LayerManager(mapViewer) 图层管理对象 Parameters: Name Type Description mapViewer wol.MapViewer wol地图实例 Source: wol-layer-manager.js, line 28 Methods getLayers() 获取图层组 Source: wol-layer-manager.js, line 80 getMap() → {ol.Map} 获取地图实例 Source: wol-layer-manager.js, line 73 Returns: Type ol.Map getTreeData() → {Array} 获取图层树 Source: wol-layer-manager.js, line 88 Returns: Type Array init(option) 初始化图层管理对象 Parameters: Name Type Description option object | undefined 过滤图层，传入待过滤图层的名称或图层名称数组，可选 Properties Name Type Description exclude string | Array.&lt;string&gt; 过滤图层，传入待过滤图层的名称或图层名称数组 target string 图层树目标容器DOM元素id Source: wol-layer-manager.js, line 40 × Search results Close "},"wol.Locator.html":{"id":"wol.Locator.html","title":"Class: Locator","body":" WolMap Namespaces DragHandlerwolwol.util Classes wol.LayerManagerwol.Locatorwol.MapViewerwol.Tracer Class: Locator wol. Locator new Locator(mapViewer) 要素定位器 Parameters: Name Type Description mapViewer wol.MapViewer wol地图实例 Source: wol-locator.js, line 15 Requires: module:wol-util.js Requires module:wol-util.js Methods createAreaFlashStyle(elapsedRatio) → {ol.style.Style} 创建面定位闪动样式 Parameters: Name Type Description elapsedRatio number 动画已执行时间所占比率 Source: wol-locator.js, line 433 Returns: 面定位闪动样式 Type ol.style.Style createLineFlashStyle(elapsedRatio) → {ol.style.Style} 创建线定位闪动样式 Parameters: Name Type Description elapsedRatio number 动画已执行时间所占比率 Source: wol-locator.js, line 413 Returns: 线定位闪动样式 Type ol.style.Style createPointFlashStyle(elapsedRatio, startRadius, endRadius) → {ol.style.Style} 创建点定位闪动样式 Parameters: Name Type Description elapsedRatio number 动画已执行时间所占比率 startRadius number 起始圆半径 endRadius number 结束圆半径 Source: wol-locator.js, line 385 Returns: 点定位闪动样式 Type ol.style.Style getFlashStyle() → {ol.style.Style} 获取定位层动画样式 Source: wol-locator.js, line 118 Returns: Type ol.style.Style getLocateLayer() → {ol.layer.Base} 获取定位图层 Source: wol-locator.js, line 86 Returns: Type ol.layer.Base getLocateSource() → {ol.source.Source} 获取定位图层数据源 Source: wol-locator.js, line 94 Returns: Type ol.source.Source getLsStrokeColor() → {string} 获取线定位颜色值 Source: wol-locator.js, line 160 Returns: Type string getMapViewer() → {wol.MapViewer} 获取wol地图实例 Source: wol-locator.js, line 78 Returns: Type wol.MapViewer getPiFillColor() → {string} 获取点定位填充颜色值 Source: wol-locator.js, line 142 Returns: Type string getPiRadius() → {string} 获取点定位半径 Source: wol-locator.js, line 151 Returns: Type string getPiStrokeColor() → {string} 获取点定位描边颜色值 Source: wol-locator.js, line 133 Returns: Type string getPlFillColor() → {string} 获取面定位填充颜色值 Source: wol-locator.js, line 178 Returns: Type string getPlStrokeColor() → {string} 获取面定位描边颜色值 Source: wol-locator.js, line 169 Returns: Type string getStaticStyle() → {ol.style.Style} 获取定位层静态样式 Source: wol-locator.js, line 102 Returns: Type ol.style.Style locate(feature, option) 定位要素 Parameters: Name Type Description feature ol.Feature 待定位要素 option object 参数项 Properties Name Type Description duration number 动画持续时间，可选参数，默认为0 times number 动画循环次数，可选参数，默认为3 autoView boolean 执行定位动画的同时是否自适应视图，默认为true Source: wol-locator.js, line 195 locateLineString(feature, duration) 定位线要素 Parameters: Name Type Description feature ol.Feature 待定位要素 duration number 动画持续时间，可选参数，默认为0 Source: wol-locator.js, line 313 locatePoint(feature, duration) 定位点要素 Parameters: Name Type Description feature ol.Feature 待定位要素 duration number 动画持续时间，可选参数，默认为0 Source: wol-locator.js, line 278 locatePolygon(feature, duration) 定位面要素 Parameters: Name Type Description feature ol.Feature 待定位要素 duration number 动画持续时间，可选参数，默认为0 Source: wol-locator.js, line 348 locateProxy(feature, duration, times, autoView) 定位要素的代理方法，根据要素类型执行不同的定位动画：Point、LineString、Polygon Parameters: Name Type Description feature ol.Feature 待定位要素 duration number 动画持续时间，可选参数，默认为0 times number 动画次数，可选参数，默认为3 autoView boolean 是否移动视图至要素，默认为true Source: wol-locator.js, line 220 setFlashStyle(style) 设置定位层动画样式 Parameters: Name Type Description style ol.style.Style Source: wol-locator.js, line 125 setStaticStyle(style) 设置定位层静态样式 Parameters: Name Type Description style ol.style.Style Source: wol-locator.js, line 109 × Search results Close "},"wol.MapViewer.html":{"id":"wol.MapViewer.html","title":"Class: MapViewer","body":" WolMap Namespaces DragHandlerwolwol.util Classes wol.LayerManagerwol.Locatorwol.MapViewerwol.Tracer Class: MapViewer wol. MapViewer new MapViewer(id, option) wol地图 Parameters: Name Type Description id string DOM元素id option object 配置项 Properties Name Type Description projection string 投影坐标系 center Array 视图中心位置，默认为 [13059385.715379057, 4734320.828070238] extent Array 视图范围 layers Array 图层配置，通过传入一至多个配置项创建图层，每个配置项须包含图层类型(type)，图层名称(name)，地图服务地址(url)等必要参数；图层类型可选值为'Vector'、'Cluster'、'Mask'、'XYZ'、'WMS'， 图层类型为'XYZ'或'WMS'时需指定地图服务地址；配置项中其他参数设置请参见wol.util.createVectorLayer、wol.util.createClusterLayer、wol.util.createMaskLayer、wol.util.createXYZLayer、wol.util.createWMSLayer、 zoom number | undefined 当前缩放类型，默认为 undefiend minZoom number | undefined 地图最小缩放级别，默认为 undefiend maxZoom number | undefined 地图最大缩放级别，默认为 undefiend controls object | undefined 地图控件配置 Properties Name Type Description zoom boolean | undefined 是否显示地图缩放控件，默认为 true scaleLine boolean | undefined 是否显示比例尺控件，默认为 true overviewMap boolean | undefined 是否显示鹰眼控件，默认为 false fullScreen boolean | undefined 是否显示全屏控件，默认为 false Source: wol-viewer.js, line 29 Requires: module:wol-util.js Requires module:wol-util.js Members callback 回调函数 Source: wol-viewer.js, line 76 Methods addLayer(layer) 添加图层 Parameters: Name Type Description layer ol.layer.Base 图层对象 Source: wol-viewer.js, line 159 addLayers(layers) 添加多个图层 Parameters: Name Type Description layers Array.&lt;ol.layer.Base&gt; 图层对象数组 Source: wol-viewer.js, line 179 extentAt(target, duration, padding) 缩放视图至指定范围 Parameters: Name Type Description target ol.Extent | ol.geom.Geometry 目标视图范围 duration number 动画持续时间，可选参数，默认为0 padding number | Array 目标视图周围间距 Source: wol-viewer.js, line 245 getCurZIndex() → {number} 获取图层序号值 This: wol.MapViewer Source: wol-viewer.js, line 92 Returns: Type number getLayerByName(name) → {ol.layer.Base} 根据图层名称获取图层 Parameters: Name Type Description name string 图层名称 Source: wol-viewer.js, line 142 Returns: 图层对象 Type ol.layer.Base getLayers() → {ol.Collection} 获取图层集合 Source: wol-viewer.js, line 133 Returns: ol集合对象 Type ol.Collection getMap() → {ol.Map} 获取地图实例 This: wol.MapViewer Source: wol-viewer.js, line 83 Returns: Type ol.Map getView() → {ol.View} 获取视图实例 Source: wol-viewer.js, line 125 Returns: 地图对象 Type ol.View panTo(target, duration) 平移视图中心点至某一坐标点或某一要素 Parameters: Name Type Description target ol.Coordinate | ol.Feature 目标坐标点或目标要素 duration number 动画持续时间，可选参数，默认为0 Source: wol-viewer.js, line 221 register(evtType, handler) 事件注册，目前仅支持'addLayer'和'removeLayer'事件 Parameters: Name Type Description evtType handler Source: wol-viewer.js, line 116 removeLayer(layer) 删除图层 Parameters: Name Type Description layer ol.layer.Base 图层对象 Source: wol-viewer.js, line 189 removeLayerByName(name) 根据图层名称删除图层 Parameters: Name Type Description name string 图层名称 Source: wol-viewer.js, line 212 removeLayers(layers) 删除多个图层 Parameters: Name Type Description layers Array.&lt;ol.layer.Base&gt; 图层对象数组 Source: wol-viewer.js, line 202 setCurZIndex(curZIndex) 设置图层序号值 This: wol.MapViewer Parameters: Name Type Description curZIndex number Source: wol-viewer.js, line 101 × Search results Close "},"wol.Tracer.html":{"id":"wol.Tracer.html","title":"Class: Tracer","body":" WolMap Namespaces DragHandlerwolwol.util Classes wol.LayerManagerwol.Locatorwol.MapViewerwol.Tracer Class: Tracer wol. Tracer new Tracer(mapViewer) 轨迹对象 Parameters: Name Type Description mapViewer wol.MapViewer wol地图实例 Source: wol-tracer.js, line 29 Requires: module:wol-util.js Requires module:wol-util.js Members animateParam :object 动画参数 Type: object Source: wol-tracer.js, line 89 status :object 动画状态 Type: object Source: wol-tracer.js, line 72 timer :object|null 动画计时器 Type: object | null Source: wol-tracer.js, line 83 Methods clear() 清除轨迹，清除之后若要执行轨迹播放你将必须重新初始化轨迹 Source: wol-tracer.js, line 352 getFlashLine() → {ol.Feature} 获取动画轨迹线要素 Source: wol-tracer.js, line 231 Returns: Type ol.Feature getFlashPoint() → {ol.Feature} 获取动画轨迹点要素 Source: wol-tracer.js, line 239 Returns: Type ol.Feature getMapViewer() → {wol.MapViewer} 获取wol地图实例 Source: wol-tracer.js, line 199 Returns: Type wol.MapViewer getTraceLayer() → {ol.layer.Base} 获取轨迹图层 Source: wol-tracer.js, line 207 Returns: Type ol.layer.Base getTraceLine() → {ol.Feature} 获取轨迹线要素 Source: wol-tracer.js, line 223 Returns: Type ol.Feature getTraceSource() → {ol.source.Source} 获取轨迹图层数据源 Source: wol-tracer.js, line 215 Returns: Type ol.source.Source init(option) 初始化轨迹播放实例 Parameters: Name Type Description option object 初始化配置项 Properties Name Type Description src ol.Feature 轨迹线要素 speed string | number 轨迹播放速度，可选值为'slow'、'normal'、'fast'，也可以是大于0的具体数值，默认为 3 afterInitialize function 轨迹初始化后的回调函数，默认为空函数 afterStart function 轨迹开始播放的回调函数，默认为空函数 afterComplete function 轨迹播放完成的回调函数，默认为空函数 ifDynamicTrack boolean 轨迹播放过程中是否开启动态追踪，默认为 false ifLocate boolean 轨迹初始化完成后是否定位至轨迹点，默认为 false icon boolean 轨迹播放图标文件路径，应是相对于该JS文件执行目录（引用该文件的页面所在目录）的路径 iconClass boolean 轨迹播放图标CSS样式，默认为‘’ iconSize boolean 轨迹播放图标大小，默认为40 iconOpacity boolean 轨迹播放图标透明度，默认为1 Source: wol-tracer.js, line 105 pause() 暂停轨迹播放 Source: wol-tracer.js, line 315 play() 播放轨迹，你可以在轨迹初始化完成后调用该方法播放轨迹或轨迹暂停播放后调用该方法继续播放 Source: wol-tracer.js, line 256 reset() 重置轨迹播放 Source: wol-tracer.js, line 329 setFlashStyle(style) 设置动态轨迹线样式 Parameters: Name Type Description style ol.style.Style 样式实例 Source: wol-tracer.js, line 403 setStaticStyle(style) 设置静态轨迹线样式 Parameters: Name Type Description style ol.style.Style 样式实例 Source: wol-tracer.js, line 394 × Search results Close "},"wol.util.html":{"id":"wol.util.html","title":"Namespace: util","body":" WolMap Namespaces DragHandlerwolwol.util Classes wol.LayerManagerwol.Locatorwol.MapViewerwol.Tracer Namespace: util wol. util 命名空间 Source: wol-util.js, line 16 Members &lt;static&gt; styles 通用样式库 Properties: Name Type Description DEFAULT_STYLE ol.style.Style 默认样式 TEXT_STYLE ol.style.Style 文本样式 MASK_BLACK ol.style.Style 黑色遮罩样式 Source: wol-util.js, line 28 Methods &lt;static&gt; createClusterLayer(option) → {ol.layer.Vector} 创建聚合图层 Parameters: Name Type Description option object 配置项 Properties Name Type Description name string | undefined 图层名称，默认为 undefined label string 图层说明，默认为 '' styleFunction ol.StyleFunction 图层样式函数, 携带feature和resolution两个参数，此函数应返回一个ol.style.Style对象或其数组，由此为单个要素及聚合要素显示不同的样式 features Array 图层默认要素，默认为 [] updateWhileAnimating boolean 动画执行过程是否实时渲染要素，默认为 true updateWhileInteracting boolean 交互过程是否实时渲染要素，默认为 false opacity number 图层透明度，默认为 1 visible boolean 图层可见性，默认为 true zIndex number | undefined 图层序号，默认为 undefined group string | undefined 图层所属图层组，默认为 undefined 即不属于任何组 Source: wol-util.js, line 133 Returns: 矢量聚合图层 Type ol.layer.Vector &lt;static&gt; createFeatureFromWKT(wkt) → {ol.Feature} 从WKT字符串中解析要素 Parameters: Name Type Description wkt string 要素的wkt描述（关于wkt请参见：http://www.cnblogs.com/tiandi/archive/2012/07/18/2598093.html） Source: wol-util.js, line 397 Returns: 要素对象 Type ol.Feature &lt;static&gt; createHeatMap(option) → {ol.layer.Heatmap} 创建热力图层 Parameters: Name Type Description option object 配置项 Properties Name Type Description name string | undefined 图层名称，默认为 undefined label string 图层说明，默认为 '' feature Array 图层默认要素，默认为 [] gradient Array 热力图层的色彩渐层颜色，默认为 ['#0ff', '#00f', '#0f0', '#ff0', '#ff5d3e'] blur number 模糊值，默认为 24 radius number 非聚合状态下最小半径，默认为 10 shadow number 阴影值，默认为 300 opacity number 图层透明度，默认为 1 visible boolean 图层可见性，默认为 true zIndex number | undefined 图层序号，默认为 undefined group string | undefined 图层所属图层组，默认为 undefined 即不属于任何组 Source: wol-util.js, line 356 Returns: 热力图层 Type ol.layer.Heatmap &lt;static&gt; createMaskLayer(option) → {ol.layer.Vector} 创建遮罩图层 Parameters: Name Type Description option object 配置项 Properties Name Type Description name string 图层名称，默认为 undefined label string 图层说明，默认为 '' style ol.style.Style 图层样式，默认为 wol.util.styles.MASK_BLACK updateWhileAnimating boolean 动画执行过程是否实时渲染要素，默认为 true updateWhileInteracting boolean 交互过程是否实时渲染要素，默认为 true opacity number 图层透明度，默认为 1 visible boolean 图层可见性，默认为 false zIndex number 图层序号，默认为 1 group string | undefined 图层所属图层组，默认为 undefined 即不属于任何组 Source: wol-util.js, line 312 Returns: 矢量图层 Type ol.layer.Vector &lt;static&gt; createVectorLayer(option) → {ol.layer.Vector} 创建矢量图层 Parameters: Name Type Description option object 配置项 Properties Name Type Description name string | undefined 图层名称，默认为 undefined label string 图层说明，默认为 '' style ol.style.Style 图层样式，默认为 wol.util.styles.DEFAULT_STYLE features Array 图层默认要素，默认为 [] updateWhileAnimating boolean 动画执行过程是否实时渲染要素，默认为 true updateWhileInteracting boolean 交互过程是否实时渲染要素，默认为 false useSpatialIndex boolean 是否开启空间索引，默认为 false opacity number 图层透明度，默认为 1 visible boolean 图层可见性，默认为 true zIndex number | undefined 图层序号，默认为 undefined group string | undefined 图层所属图层组，默认为 undefined 即不属于任何组 Source: wol-util.js, line 82 Returns: 矢量图层 Type ol.layer.Vector &lt;static&gt; createWKTFromFeature(feature) → {string} 导出要素为WKT字符串 Parameters: Name Type Description feature ol.Feature 要素对象 Source: wol-util.js, line 407 Returns: 要素的wkt描述 Type string &lt;static&gt; createWMSLayer(option) → {ol.layer.Tile} 创建网络地图图层 Parameters: Name Type Description option object 配置项 Properties Name Type Description name string 图层名称，默认为 undefined label string 图层说明，默认为 '' url string 网络地图服务地址 params object WMS必须参数，其中必须包含 LAYERS serverType string | undefined 远程网络地图服务类型，可选值为'carmentaserver', 'geoserver', 'mapserver', 'qgis'，默认为 undefined maxZoom number 图层的最大缩放等级 opacity number 图层透明度，默认为 1 visible boolean 图层可见性，默认为 true zIndex number 图层序号，默认为 undefined group string | undefined 图层所属图层组，默认为 undefined 即不属于任何组 Source: wol-util.js, line 263 Returns: WMS图层 Type ol.layer.Tile &lt;static&gt; createXYZLayer(option) → {ol.layer.Tile} 创建XYZ图层 Parameters: Name Type Description option object 配置项 Properties Name Type Description name string 图层名称，默认为 undefined label string 图层说明，默认为 '' url string 切片服务地址 crossOrigin string | undefined 请求类型，'anonymous' 或 undefined，默认为 undefined；设置为'anonymous'时请求类型变为跨域请求，但切片服务器必须进行跨域设置 minZoom number | undefined 图层的最小缩放等级，默认为 undefined maxZoom number | undefined 图层的最大缩放等级，超过该等级不再请求新的瓦片，默认为 undefined opacity number 图层透明度，默认为 1 visible boolean 图层可见性，默认为 true zIndex number 图层序号，默认为 undefined group string | undefined 图层所属图层组，默认为 undefined 即不属于任何组 Source: wol-util.js, line 213 Returns: 切片图层 Type ol.layer.Tile &lt;static&gt; extend(arg) → {object} 对象扩展（jQuery extend机制） Parameters: Name Type Description arg boolean | object 可变参数，你可以传入任意个参数将它们合并为一个对象；当不传入任何参数或者只有一个参数且类型不是对象，或者该参数为布尔值时将返回空对象；当参数个数大于等于两个时， 若第一个参数类型不是布尔值或为 false ，将返回后续参数的浅拷贝合并，否则返回第一个参数后续参数的深拷贝合并 Source: wol-util.js, line 428 Returns: 扩展后的对象 Type object &lt;static&gt; getColorArray(color) → {Array} 获取颜色值数组 Parameters: Name Type Description color string 颜色字符串表示 Source: wol-util.js, line 588 Returns: 颜色RGB数组 Type Array &lt;static&gt; getColorType(colorStr) → {string} 获取颜色表示类型 Parameters: Name Type Description colorStr string 颜色字符串表示 Source: wol-util.js, line 505 Returns: RGB/十六进制 Type string &lt;static&gt; splitCoordinates(sourceCoords, step) → {Array.&lt;ol.Coordinate&gt;} 拆分坐标点数组，在两两坐标点之间按均匀步长生成密集的坐标点 Parameters: Name Type Description sourceCoords Array.&lt;ol.Coordinate&gt; 原始坐标点数组 step number 步长（沿线方向） Source: wol-util.js, line 609 Returns: Type Array.&lt;ol.Coordinate&gt; &lt;static&gt; toHexColor(rgbStr) → {string} 将rgb颜色值转换为16进制形式 Parameters: Name Type Description rgbStr string 颜色RGB字符串表示 Source: wol-util.js, line 524 Returns: 颜色16进制字符串表示 Type string &lt;static&gt; toRGBColor(hexStr) → {string} 将16进制颜色值转换为rgb形式 Parameters: Name Type Description hexStr string 颜色16进制字符串表示 Source: wol-util.js, line 561 Returns: 颜色RGB字符串表示 Type string &lt;static&gt; transform(feature, from, to) 对要素进行坐标转化 Parameters: Name Type Description feature ol.Feature 待转换要素 from ol.proj.ProjectionLike 转换前投影坐标系 to ol.proj.ProjectionLike 转换后投影坐标系 Source: wol-util.js, line 418 × Search results Close "}}
    </script>

    <script type="text/javascript">
        $(document).ready(function() {
            Searcher.init();
        });

        $(window).on("message", function(msg) {
            var msgData = msg.originalEvent.data;

            if (msgData.msgid != "docstrap.quicksearch.start") {
                return;
            }

            var results = Searcher.search(msgData.searchTerms);

            window.parent.postMessage({"results": results, "msgid": "docstrap.quicksearch.done"}, "*");
        });
    </script>
</body>
</html>
